<template>
  <div>
    <el-button
      type="primary"
      icon="el-icon-download"
      @click="visible = true"
    >{{ $t('EXPORT') }}</el-button>
    <el-dialog
      :title="$t('SELECT_EXPORT')"
      :visible.sync="visible"
      width="450px"
    >
      <div class="mb-20">
        {{ $t('EXPORT_ALL_TIPS', { count: 10000 }) }}
      </div>
      <div class="pb-30 flex justify-center">
        <el-button
          type="primary"
          size="small"
          class="mr-40"
          @click="handleExport('current')"
        >{{ $t('EXPORT_CURRENT_PAGE') }}</el-button>
        <el-button
          type="primary"
          size="small"
          @click="handleExport('all')"
        >{{ $t('EXPORT_ALL') }}</el-button>
      </div>
    </el-dialog>
  </div>
</template>

<script>
  import { downloadFile } from '@/utils/common'
  import exportApi from '@/api/oen/ExportApi'
  import bizOpenApi from '@/api/oen/BizOpenApi'

  export default {
    name: 'ImportDialog',
    props: {
      queryData: {
        type: Object,
        default: () => {}
      },
      pageData: {
        type: Object,
        default: () => {}
      },
      exportFuncName: {
        type: String,
        require: true,
        default: ''
      },
      fileName: {
        type: String,
        require: true,
        default: ''
      },
      formateType: {
        type: String,
        default: 'out'
      },
      apiName: {
        type: String,
        default: 'exportApi'
      }
    },
    data() {
      return {
        visible: false,
        apiData: {
          bizOpenApi: bizOpenApi,
          exportApi: exportApi
        }
      }
    },
    methods: {
      // 下载模板
      handleExport(type) {
        const pageData = { ...this.pageData }
        if (type === 'all') {
          pageData.page = 1
          pageData.size = 10000
        }
        let queryData = {
          ...this.queryData,
          page: pageData
        }
        // 请求数据page为展开的模式
        if (this.formateType === 'out') {
          queryData = {
            ...this.queryData,
            ...pageData
          }
        }
        queryData.type = type
        this.apiData[this.apiName][this.exportFuncName](queryData).then(res => {
          downloadFile(res, this.fileName)
          this.visible = false
        })
      }

    }
  }
</script>

